{% extends "base.html" %}

{% block nav %}
    
{% endblock %}

{% block head %}
    <script type="text/javascript" src="/static/js/jquery.js"/>

    <script type="text/javascript" src="/static/js/jquery.dimensions.min.js"></script>
    
    <link rel="stylesheet" type="text/css" href="/static/css/ptTimeSelect/ui.core.css" media="screen" />
    <link rel="stylesheet" type="text/css" href="/static/css/ptTimeSelect/ui.theme.css" media="screen" />
    <link rel="stylesheet" type="text/css" href="/static/css/ptTimeSelect/jquery.ptTimeSelect.css" />
    <script type="text/javascript" language="JavaScript" src="/static/js/jquery.ptTimeSelect.js"></script>
    
    {% load adminmedia %}
    <script type="text/javascript" src="/admin/jsi18n/"></script>
    <script type="text/javascript" src="/static/grappelli/js/core.js"></script>
    <link rel="stylesheet" type="text/css" href="/static/grappelli/css/widgets.css" media="screen" />
    <script type="text/javascript">
        window.__admin_media_prefix__ = "{% filter escapejs %}{% admin_media_prefix %}{% endfilter %}";
    </script>
    {{ form.media }}
    
    <script language="JavaScript">
        $(document).ready(
            function () {
                $('code').each(
                    function() {
                        eval($(this).html());
                    }
                )
            }
        );
    </script>
    
    <script type="text/javascript">
        function check_time() {
            lunch_out = document.timesheet_form.time_lunch.value;
            lunch_in = document.timesheet_form.time_lunch_return.value;
            if (lunch_out == "" && lunch_in == "") {
                document.timesheet_form.time_lunch.value = "12:00 pm";
                document.timesheet_form.time_lunch_return.value = "12:00 pm";
            }
            return check_date();
        }
        
        function no_lunch() {
            document.timesheet_form.time_lunch.value = "";
            document.timesheet_form.time_lunch_return.value = "";
        }
        
        function check_date() {
            date = new Date(document.timesheet_form.date.value.replace('-', '/').replace('-', '/'));
            if (date.getDay()%6==0) {
                if (confirm('Warning: You have selected a weekend.')) {
                    return true;
                } else {
                    return false;
                } 
            }
            return true;
        }
    </script>
{% endblock %}

{% block css %}
    span.hidden{
        visibility:hidden;
    }
    
    .spacer{
        height: 10px;
    }
    
    input.button {
        background:url('/static/images/gradient_light.jpg') repeat-x 50% 50% #f8f8f8;
        border-radius:10px;
        color: #444;
        padding: 2px; /* sliding doors padding */
        font-size:1.1em;
    }

    input.button:active {
        background-position: bottom right;
        color: #000;
        outline: none; /* hide dotted outline in Firefox */
    }
    
    textarea {
        width: 99.9%;
        height: 90px;
    }
    
    code {
        position: absolute;
        visibility:hidden;
    }
{% endblock %}

{% block content %}
    <h2>Time Card</h2>
    {{ form.non_field_errors }} 
    {% if warning %}
        <br/><h3 style="color: red;">Warning student has already posted a time sheet for today. You may approve it <a href="{% url ecwsp.work_study.views.approve %}?key={{ key }}">here</a></h3><br/>
    {% endif %}
    <form action="" name="timesheet_form" onsubmit="return check_time()" method="post">
         {% if not form.for_pay.is_hidden %}
         {{ form.for_pay.errors }} {{ form.for_pay }} {{ form.for_pay.help_text }}
         <br/>
         {% endif %}
         
         {{ form.make_up.errors }} {{ form.make_up }} {{ form.make_up.help_text }}
         <br/><p class="spacer"/>
        <table style="width: 100%; margin:auto">
            <tr>
                <td> Student Name: {{ studentName }} </td>
                <td> Supervisor Name: {{ supervisorName }} </td>
            </tr>
            <tr>
                <td colspan="2">
                    <table class="border">
                        <tr>
                            <td class="border"> Date: {{ form.date.errors }}</td>
                            <td class="border"> Start Time: {{ form.time_in.errors }}</td>
                            <td class="border"> Lunch Out: {{ form.time_lunch.errors }} </td>
                            <td class="border"> Lunch In: {{ form.time_lunch_return.errors }}</td>
                            <td class="border"> End Time: {{ form.time_out.errors }}</td>
                        </tr>
                        <tr>
                            <td class="border"> {{ form.date }} </td>
                            <td class="border"> {{ form.time_in }} </td>
                            <td class="border"> {{ form.time_lunch }}  </td>
                            <td class="border"> {{ form.time_lunch_return }} </td>
                            <td class="border"> {{ form.time_out }} </td>
                            <code>
                                $('#id_time_in').ptTimeSelect();
                                $('#id_time_lunch').ptTimeSelect();
                                $('#id_time_lunch_return').ptTimeSelect();
                                $('#id_time_out').ptTimeSelect();
                            </code>
                        </tr>
                    </table>
                    <a href="#" onclick="no_lunch()" >No Lunch</a>
                </td>
            </tr>
            <tr class="spacer"></tr>
            <tr>
                <td colspan="2">
                    {% if student %}
                        <table class="border"> 
                            <tr> 
                                <td colspan="5" style="text-align: center;">Daily Student Worker Performance</td>
                            </tr>
                            <tr>
                                {% for performance_choice in performance_choices %}
                                    <td class="border" style="padding"> <input disabled="disabled" type="radio" /> {{ performance_choice }} </td> 
                                {% endfor %}
                            </tr> 
                        </table>
                    {% else %}
                        {{ form.performance.errors }}
                        <table class="border">
                            <tr> 
                                <td colspan="5" style="text-align: center;">Daily Student Worker Performance</td>
                            </tr>
                            <tr>
                                {{ form.performance }}
                            </tr>
                        </table>
                    {% endif %}        
                </td>
            </tr>
            <tr class="spacer"></tr>
            <tr>
                {% if approved %}
                    <td style="text-align: center;"> Approved by supervisor </td>
                {% else %}
                    <td style="text-align: center;"> Not yet approved by supervisor </td>
                {% endif %}    
                {% if student %}
                    <td style="text-align: center;"> Not yet submitted by student </td>
                {% else %}
                    <td style="text-align: center;"> Approved by student </td>
                {% endif %}
            </tr>
            <tr class="spacer"></tr>
            <tr>
                <td colspan="2" class="border">
                    My Major Accomplishment For Today Was: {{ form.student_accomplishment.errors }}<br/>
                    {{ form.student_accomplishment }}
                </td>
            </tr>
            <tr class="spacer"></tr>
            <tr>
                <td colspan="2" class="border">
                    Client Comments, Concerns, Praises:
                    {% if student %}
                        <textarea disabled="disabled"></textarea>
                    {% else %}
                        {{ form.supervisor_comment.errors }} 
                        {{ form.supervisor_comment }} 
                        <br/>
                        {{ form.show_student_comments }} Allow students to see comments and performance review.
                    {% endif %}
                </td>
            </tr>
        </table>
        {{ form.my_supervisor.errors }} {{ form.my_supervisor }} Primary supervisor (where emails are sent to) <br/><p class="spacer"/><p class="spacer"/>
        <!--[if IE 7]>
                <br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
        <![endif]-->
        {% if student %}
            <input class="button" type="submit" value="Submit For Approval"/>
        {% else %}
            <input class="button" type="submit" value="Approve Time Card"/>
        {% endif %}
        <span class="hidden">{{ form.student }} {{ form.company }} {{ form.edit }}</span>
        
    </form>
{% endblock %}

